let i = 1;
$(".down").click(function() {
    i *= -1;
    $(this).next("ul").stop().slideToggle(600);
    if (i == -1) {
        $(this).children().css({
            transform: "rotateZ(180deg)",
        })
    } else {
        $(this).children().css({
            transform: "rotateZ(0)",
        })
    }
})

$(".select-val").click(function() {
    $(".select-down").slideToggle(600)
})

$(".select-down li").click(function() {
    $(".select-val").html($(this).html())
    $(".select-down").slideToggle(600)
})

$(".right-shop li").mouseenter(function() {
    $(this).children(".shop-img").children("img").css({
        width: 306.5,
        margin: "3px auto"
    })
    $(this).children(".shop-img").css({
        border: "2px solid black"
    })
    $(this).children(".shop-img").children(".hover").css({
        opacity: 1,
    })
    $(this).children(".swiper-skr").css({
        visibility: "visible"
    })
})

$(".right-shop li").mouseleave(function() {
    $(this).children(".shop-img").children("img").css({
        width: 316.5,
        margin: ""
    })
    $(this).children(".shop-img").css({
        border: ""
    })
    $(this).children(".shop-img").children(".hover").css({
        opacity: 0,
    })
    $(this).children(".swiper-skr").css({
        visibility: "hidden"
    })
})

$(".swiper-skr div").mouseenter(function() {
    $(this).children().css({
        width: 40.5,
    })
    $(this).css({
        border: "2px solid black",
    });
    $(this).parent(".swiper-skr").prevAll(".shop-img").children("img").attr("src", "images/" + $(this).children().attr("src"))
})

$(".swiper-skr div").mouseleave(function() {
    $(this).children().css({
        width: 44.5,
    })
    $(this).css({
        border: "",
    })
})

$(".right-shop li").click(function() {
    let b = $(this).find(".shop-number").html();
    location.href = "../detail/detail.html?id=" + b;
})